    <template>
      <div id="index" class="remitInfo">
        <PageHeader :lang="lang"></PageHeader>
        <!--资产总览-->
        <div class="pageBody" id="pageBody">
          <!-- 左侧部分 -->
          <pageLeftMenu ref="getUnReadNotInfo"></pageLeftMenu>
          <!-- 右侧部分 -->
          <div class="pageMain">
              <div class="main" style="height:560px;">
                <h2>{{lang['please pass through']}}</h2>
                <div>
                  <ul>
                    <li>
                      <span>{{lang['due bank']}}</span>
                      <span>{{list.BankName}}</span>
                    </li>
                    <li>
                      <span>{{lang['bank Address']}}</span>
                      <span>{{list.BankBranch}}</span>
                    </li>
                    <li>
                      <span>{{lang['bank account']}}</span>
                      <span>{{list.BankCard}}</span>
                    </li>
                    <li>
                      <span>{{lang['name of account holder']}}</span>
                      <span>{{list.CompanyName}}</span>
                    </li>
                    <li>
                      <span>SWIFT CODE</span>
                      <span>{{list.SwiftCode }}</span>
                    </li>
                    <li>
                      <span>{{lang['full name']}}</span>
                      <span>{{userID}}</span>
                    </li>
                    <div class="fasong-shouji-youxiang">
                      <button @click="fasong(1)" :disabled="yingcang">{{lang['send mail to']}}</button>
                      <button @click="fasong(2)" :disabled="yingcangs">{{lang['send to mp']}}</button>
                    </div>
                  </ul>
                </div>
              </div>

            <!-- 特别提醒 -->
            <div class="bankcard_tishih">
              <h3>{{lang['attention Please']}}：</h3>
              <p v-if="assetsCode === 'USD'">1. {{lang['only receive dollar'].replace('{nation}', 'USD')}}</p>
                <p v-else-if="assetsCode === 'HKD'">1. {{lang['only receive dollar'].replace('{nation}', 'HKD')}}</p>
              <p>2. {{lang['remittance remark']}}：{{userID}}</p>
              <p>3. {{lang['Minimum deposit amount'].replace('{Minimums}', (FeeRateData.MinRecharge || 0) + ' ' + assetsCode || [])}}</p>
              <p>4. {{lang['charge for recharge']
                      .replace('{charges}', ((FeeRateData.FeeRate || 0) * 100) + '%' || [])
                      .replace('{Minimumcharge}', (FeeRateData.MinFee || 0) + ' ' + assetsCode || [])}}
              </p>
              <p>5. {{lang['The handling']}}</p>
              <p>6. {{lang['Our platform']}}</p>
            </div>

            <SwModal :isShow.sync="showModal" :isShowBg="true"  modalClass="userModal remitlnfo" :isCloseOnClickBg="true" :onClosed="onClosed"  :noText="lang['cancelBth']" :okText="lang['send']" :ok="showModalOk" >
              <div class="BombBox">
                <h2>{{fasogTitle}}</h2>
                <div class="addbank">
                  <ul>
                    <li>
                      <span>{{lang['due bank']}} :</span>
                      <span>{{list.BankName}}</span>
                    </li>
                    <li>
                      <span>{{lang['name of account holder']}} :</span>
                      <span>{{list.CompanyName}}</span>
                    </li>
                    <li>
                      <span>{{lang['bank account']}} :</span>
                      <span>{{list.BankCard}}</span>
                    </li>
                    <li>
                      <span>SWIFT CODE :</span>
                      <span>{{list.SwiftCode }}</span>
                    </li>
                    <li>
                      <span>{{lang['full name']}} :</span>
                      <span>{{userID}}</span>
                    </li>
                  </ul>
                </div>
                <!-- 弹框发送信息-特别提醒 -->
                <!-- 特别提醒 -->
                <div class="bankcard_tishih">
                  <h3>{{lang['attention Please']}}：</h3>
                  <p v-if="assetsCode === 'USD'">1. {{lang['only receive dollar'].replace('{nation}', 'USD')}}</p>
                    <p v-else-if="assetsCode === 'HKD'">1. {{lang['only receive dollar'].replace('{nation}', 'HKD')}}</p>
                  <p>2. {{lang['remittance remark']}}：{{userID}}</p>
                  <p>3. {{lang['Minimum deposit amount'].replace('{Minimums}', (FeeRateData.MinRecharge || 0) + ' ' + assetsCode || [])}}</p>
                  <p>4. {{lang['charge for recharge']
                          .replace('{charges}', ((FeeRateData.FeeRate || 0) * 100) + '%' || [])
                          .replace('{Minimumcharge}', (FeeRateData.MinFee || 0) + ' ' + assetsCode || [])}}
                  </p>
                  <p>5. {{lang['The handling']}}</p>
                  <p>6. {{lang['Our platform']}}</p>
                </div>
              </div>
            </SwModal>
            <!-- 弹窗插件 -->
<!--             <span @click="showTip">show_tip</span>
            <span @click="showConfirm">show_confirm</span> -->
            <!-- 弹窗插件 -->
          </div>
        </div>

        <!--资产总览-->
        <PageFooter2 :lang="lang" :langKey="langKey"></PageFooter2>
      </div>
    </template>
    <script>
import commonMixins from '@/mixins/common.js'
import SwModal from '@/components/SwModal'
import ModalApi from '@/components/SwModal/api.js'
import pageLeftMenu from './components/pageLeftMenu.vue'
export default {
  mixins: [commonMixins],
  data () {
    return {
      currentIndex: 0,
      limitNum: 3,
      adfasdf: false,
      showModal: false,
      show_withdraw: false,
      withdraw: false,
      showModalss: false,
      list: [],
      show: false,
      phone: '',
      zijinmima: false,
      yingcang: false,
      yingcangs: false,
      fasongss: '',
      fasongPost: '',
      fasogTitle: '',
      safePwd: '',
      password: '',
      Announcement: true,
      userID: '',
      assetsCode: '',
      FeeRateData: [],
      defaultAssetsID: ''
    }
  },
  components: {
    SwModal,
    pageLeftMenu
  },
  methods: {
    showTip () {
      ModalApi.message(this.lang['Sent'], null, null, 'userModal')
    },
    jiazaiyinghangka () {
      setTimeout(() => {
        this.userID = this.mixUserInfo.userName
        this.$http.post('CompanyBank/GetCompanyRemittance', {
          assetsCode: this.assetsCode
        }, {
          modalOptions: {
            modalClass: 'userModal'
          }
        })
        .then((res) => {
          this.list = res.Data
        })
      }, 500)
    },
    // 发送邮件
    showModalOk () {
      this.showModal = false
      this.yingcang = false
      this.yingcangs = false
      if (this.fasongss === 1) {
        this.fasongPost = 'SendEmail/SendRechargeEmail'
      } else {
        this.fasongPost = 'SendSMS/SendRechargeSMS'
      }
      this.$http.post(this.fasongPost, {
        assetsCode: this.$route.query.assetsCode
      }, {
        modalOptions: {
          modalClass: 'userModal'
        }
      })
      .then((res) => {
        if (res.StatusCode === '200') {
          this.$refs.getUnReadNotInfo.$emit('getUnReadNotInfo') // 调用财务记录最新显示
          ModalApi.message(this.lang['Sent'], 1000, () => {
            this.$nextTick(() => {
              this.$router.push({path: '/assets'})
            })
          }, 'userModal')
        } else {
          this.showModal = true
          this.yingcang = true
          this.yingcangs = true
          ModalApi.message(this.lang['fail'], null, null, 'userModal')
        }
      })
      // setTimeout(() => {
      //   this.showTip()
      //   history.back()
      // }, 300)
    },
    onClosed () {
      this.showModal = false
    },
    fasong (e) {
      this.fasongss = e
      this.$http.post('Security/GetCustomer', {
      }, {
        modalOptions: {
          modalClass: 'userModal'
        }
      })
      .then((res) => {
        // res.phone = null
        // res.Email = '231313213'
        if (e === 1) {
          if (res.Email === null) {
            let confirm = ModalApi.confirm({
              isShowCloseBtn: true,
              isCloseOnClickBg: true,
              modalClass: 'userModal',
              title: 'point out',
              content: 'you are not yet bound to the mailbox',
              okText: 'bindings',
              noText: '',
              isShowBg: true,
              ok: () => {
                confirm.close()
                this.$nextTick(() => {
                  this.$router.push({path: '/safety?isToggleEmail=true'})
                })
              },
              no: () => {
                confirm.close()
              }
            })
          } else {
            // SendEmail/SendRechargeEmail
            this.showModal = true
            this.fasogTitle = this.lang['send account information to mailbox']
          }
        } else {
          if (res.Phone === null) {
            let confirm = ModalApi.confirm({
              isCloseOnClickBg: true,
              isShowCloseBtn: true,
              modalClass: 'userModal',
              title: 'point out',
              content: 'you are not yet bound to the phone',
              okText: 'bindings',
              noText: '',
              isShowBg: true,
              ok: () => {
                confirm.close()
                this.$nextTick(() => {
                  this.$router.push({path: '/safety?isShowForgerPin=true'})
                })
              },
              no: () => {
                confirm.close()
              }
            })
          } else {
            // SendSMS/SendRechargeSMS
            this.showModal = true
            this.fasogTitle = this.lang['send account information text message to you']
          }
        }
      })
    },
    chongzhitishi () {
      let confirm = ModalApi.confirm({
        isCloseOnClickBg: true,
        isShowCloseBtn: true,
        modalClass: 'userModal',
        title: 'prompt message',
        content: 'page special reminder',
        okText: 'determineBth',
        noText: '',
        isShowBg: true,
        ok: () => {
          confirm.close()
        },
        no: () => {
          confirm.close()
        }
      })
    },
    // 获取货币ID
    getCurryID () {
      this.$http.post('Bank/GetCurrencyList', {
      }, {
        modalOptions: {
          modalClass: 'userModal'
        }
      }).then((res) => {
        let tmp = res.Data || []
        for (let i = 0; i < tmp.length; i++) {
          if (tmp[i].Code === this.$route.query.assetsCode) {
            // 窗体加载的时候需要这个ID
            this.defaultAssetsID = tmp[i].ID
            break
          }
        }
      })
    }
  },
  mounted () {
    this.getCurryID()
    setTimeout(() => {
      // 获取说明数据
      this.assetsCode = this.$route.query.assetsCode
      let assetsId = this.defaultAssetsID
      this.$http.post('Setting/GetRechargeConfig', {
        assetsID: assetsId
      }, {
        modalOptions: {
          modalClass: 'userModal'
        }
      }).then((res) => {
        this.FeeRateData = res.Data || []
      })
    }, 200)
    this.jiazaiyinghangka()
    this.chongzhitishi()
  }
}
</script>

<style lang="less">
.userModal{
  .head{
    text-align: center;
  }
  .sw-confirm{
    text-align: center;
  }
.BombBox {
    width: 570px;
    color: #c4c9c7;
    border-radius: 5px;
    border-radius: 5px;
    padding: 0 30px;
    .addbank ul li {
      line-height: 30px;
    }
    .btn {
      padding: 0 20px;
      width: auto;
    }
    h2 {
      color: #c4c9c7;
      font-size: 14px;
      text-align: center;
      border-bottom: 1px solid #252933;
      padding: 15px 0;
    }
    .addbank,
    .bankcard_tishih {
      font-size: 12px;
      margin: 20px 0;
      font-weight: lighter;
    }
    .addbank{
      font-size: 14px;
    }
    .bankcard_tishih {
      font-size: 12px;
      color: #c4c9c7;
    }
    .addbank_pop {
      width: 580px;
      height: 210px;
      padding-top: 90px;
      background-color: #c4c9c7;
      border-radius: 2px;
    }
  }
}
.remitInfo {
  .pageMenu{
    .current{
      background: #3782FF;
    }
  }
  .pageMain {
    height: 900px !important;
    font-weight: lighter;
    /*发送汇款信息弹框*/
    background: #1A1F2B;
    /*.sw-confirm .body{font-size: 16px; line-height: 50px; text-align: center;}*/
    /*汇款信息*/
    .main h2 {
      padding: 20px 0;
      text-align: center;
      font-size: 18px;
      color: #c4c9c7;
    }
    .main ul {
      display: block;
      width: 420px;
      margin: 0 auto;
    }
    .main ul li span {
      display: block;
      padding: 0 10px;
      color: #bbb;
      height: 40px;
      line-height: 40px;
    }
    .main ul li span+span {
      font-size: 12px;
      text-align: left;
      background: #2A3440;
      width: 400px;
      border-radius: 2px;
    }
    .fasong-shouji-youxiang {
      position: relative;
      top: 30px;
    }
    .fasong-shouji-youxiang button {
      display: inline-block;
      font-weight: lighter;
      color:white;
      font-size: 12px;
      width: 180px;
      float: left;
      text-align: center;
      line-height: 40px;
      height: 40px;
      background: #3782FF;
      border-radius: 2px;
    }
    .fasong-shouji-youxiang button+button {
      float: right;
    }
    /*特别提醒*/
    .bankcard_tishih {
      position: relative;
      top: 70px;
      padding:0 20px;
      clear: both;
      h3 {
        font-size: 12px;
        color: #FD3117;
        font-weight: normal;
        padding-bottom: 10px;
      }
      p {
        color: #FD3117;
        font-size: 12px;
        line-height: 30px;
      }
    }
  }
}

</style>
